<template>
  <div>
    <div class="zx_titel">审图资料上传</div>
    <div class="upload_list">
<!--      <div class="drawingsUploadLayout">主场表格</div>-->
      <div class="fill_row">
        <el-form
          :model="ruleForm"
          :rules="rules"
          ref="ruleForm"
          label-position="top"
          label-width="120px"
          class="demo-ruleForm"
        >
          <el-form-item label="施工单位资质证明" prop="imgurl">
            <div class="upload_text">
              要求：搭建单位提交营业执照扫描件、资质证书扫描件
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl"
              :attachmentType="attachmentType1"
              :imgtype="1"
              :limit="5"
              :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="特装展台搭建委托书" prop="imgurl1">
            <div class="upload_text">
              要求：必须填写完整，搭建单位及参展单位签字盖章
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl1"
              :attachmentType="attachmentType2"
              :imgtype="2"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="特装搭建施工安全责任书" prop="imgurl2">
            <div class="upload_text">
              要求：必须填写完整，搭建单位签字盖章。
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl2"
              :attachmentType="attachmentType3"
              :imgtype="3"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="音量控制承诺书" prop="imgurl3">
            <div class="upload_text">
              要求：必须填写完整，由参展单位签字盖章
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl3"
              :attachmentType="attachmentType4"
              :imgtype="4"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="电工证" prop="imgurl4">
            <div class="upload_text">
              要求：提交彩色正反面有效电工证件，搭建单位盖章
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl4"
              :attachmentType="attachmentType5"
              :imgtype="5"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="电动工具入馆申请" prop="imgurl5">
            <div class="upload_text">要求：必须填写完整，搭建单位签字盖章</div>
            <ImageUpload
              v-model="ruleForm.imgurl5"
              :attachmentType="attachmentType6"
              :imgtype="6"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="展台效果图" prop="imgurl6">
            <div class="upload_text">
              要求：需提交彩色正面、侧面、俯视图并标注尺寸，搭建单位盖章
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl6"
              :attachmentType="attachmentType7"
              :imgtype="7"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="展台平面图" prop="imgurl7">
            <div class="upload_text">
              要求：需标注配电箱安装位置及展台的区域分布，搭建单位盖章
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl7"
              :attachmentType="attachmentType8"
              :imgtype="8"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="展台施工图" prop="imgurl8">
            <div class="upload_text">
              要求：需提交全套图纸并要求标注详细尺寸、选材、规格，搭建单位盖章
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl8"
              :attachmentType="attachmentType9"
              :imgtype="9"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="网格图" prop="imgurl9">
            <div class="upload_text">要求：需提交正面、侧面网格图标明高度，搭建单位盖章</div>
            <ImageUpload
              v-model="ruleForm.imgurl9"
              :attachmentType="attachmentType10"
              :imgtype="10"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="电路图" prop="imgurl10">
            <div class="upload_text">
              要求：需标注电器回路、回路负载、所用材质的规格及型号，搭建单位盖章
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl10"
              :attachmentType="attachmentType11"
              :imgtype="11"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="吊点图" prop="imgurl12">
            <div class="upload_text">
              要求：需提交效果图、平面图、材质说明图、吊点点位重量计算图 （每个吊点重量不能超过100kg），搭建单位盖章
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl12"
              :attachmentType="attachmentType13"
              :imgtype="13"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="维保证" prop="imgurl13">
            <div class="upload_text">
              要求：需提交正确的个人信息，搭建单位盖章
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl13"
              :attachmentType="attachmentType14"
              :imgtype="14"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
          <el-form-item label="结构安全证明书" prop="imgurl11">
            <div class="upload_text">
              要求：搭建二层展台的参展单位须提供建筑部门出具的展台结构安全证明书，搭建单位盖章
            </div>
            <ImageUpload
              v-model="ruleForm.imgurl11"
              :attachmentType="attachmentType12"
              :imgtype="12"
              :limit="5"
               :bool="bool"
            ></ImageUpload>
          </el-form-item>
        </el-form>
      </div>

      <div class="img_upload"></div>
      <!-- @click="hanldnext(4)" -->
      <div class="but_warp">
        <!-- <el-button size="mini" @click="hanldnext(2)">上一步</el-button> -->
        <el-button size="mini" @click="hanlupad" type="danger"
          >保存并下一步</el-button
        >
      </div>
    </div>
  </div>
</template>
<script>
import { upalodapply, applydetils, doUpply } from "@/api/outfit/drawingadd.js";
import { getToken, setToken } from "@/utils/auth";
import { stand_info } from "@/api/outfit/drawingadd.js";
export default {
  name: 'step4',
  props:[
    'appid','bool'
  ],
    // bool:{
    //   type:Boolean
    // },
    // ''
  data() {
    return {
      dialogImageUrl: "",
      dialogVisible: false,
      disabled: false,
      dialoginput: false,
      infodata: {},
      attachmentType1: [],
      attachmentType2: [],
      attachmentType3: [],
      attachmentType4: [],
      attachmentType5: [],
      attachmentType6: [],
      attachmentType7: [],
      attachmentType8: [],
      attachmentType9: [],
      attachmentType10: [],
      attachmentType11: [],
      attachmentType12: [],
      attachmentType13: [],
      attachmentType14: [],
      ruleForm: {
          imgurl: null,
          imgurl1: null,
          imgurl2:null,
          imgurl3:null,
          imgurl4:null,
          imgurl5:null,
          imgurl6:null,
          imgurl7:null,
          imgurl8:null,
          imgurl9:null,
          imgurl10:null,
          imgurl11:null,
          imgurl12:null,
          imgurl13:null,
          isProblem1: null,
          isProblem2: null,
          isProblem3: null,
          isProblem4: null,
          isProblem5: null,
          isProblem6: null,
          isProblem7: null,
          isProblem8: null,
          isProblem9: null,
          isProblem10: null,
          isProblem11: null,
          isProblem12: null,
          isProblem13: null,
      },
      rules: {
        imgurl: [{  required: true, message: "请上传图片", trigger: "blur" }],
        imgurl1: [{ required: true, message: "请上传图片", trigger: "blur" }],
        imgurl2: [{ required: true, message: "请上传图片", trigger: "blur" }],
        imgurl3: [{ required: true, message: "请上传图片", trigger: "blur" }],
        imgurl4: [{ required: true, message: "请上传图片", trigger: "blur" }],
        imgurl5: [{ required: true, message: "请上传图片", trigger: "blur" }],
        imgurl6: [{ required: true, message: "请上传图片", trigger: "blur" }],
        imgurl7: [{ required: true, message: "请上传图片", trigger: "blur" }],
        imgurl8: [{ required: true, message: "请上传图片", trigger: "blur" }],
        imgurl9: [{ required: true, message: "请上传图片", trigger: "blur" }],
        imgurl10: [{ required: true, message: "请上传图片", trigger: "blur" }],


        // imgurl11: [{ required: true, message: "请上传图片", trigger: "blur" }],
      },
    };
  },
  created() {
    this.infodata = JSON.parse(getToken("jd"));
    this.getdetils();
  },
  activated() {
      this.getdetils();
  },
  
  methods: {
    hanldnext(index) {
      this.$emit("hanldnext", index);
    },
    hanlupad() {
      console.log(this.ruleForm)
      this.$refs.ruleForm.validate((valid) => {
        debugger;
        if (valid) {
          let from = {
            id: this.appid,
            applyStatus: 0,
            applyStep:4,
          };
          doUpply(from).then((res) => {
            if (res.code == 200) {
              // let standForm = {
              //   id:
              // },
              // stand_info(standForm).then((res) => {
              //
              // }
              this.hanldnext(4);
            }
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    // 查询附件详情
    getdetils() {
      applydetils(this.appid).then((res) => {
        console.log(res);
        this.attachmentType1 = res.rows.filter(
          (item) => item.attachmentType == 1
        );
        console.log(this.attachmentType1);
        if (this.attachmentType1 != null && this.attachmentType1.length > 0) {
          this.ruleForm.imgurl = this.attachmentType1[0].attachmentUrl;
          this.ruleForm.isProblem = this.attachmentType1[0].attachmentType;
        }

        console.log(this.ruleForm.imgUrl)
        this.attachmentType2 = res.rows.filter(
          (item) => item.attachmentType == 2
        );
        if (this.attachmentType2 != null && this.attachmentType2.length > 0) {
          this.ruleForm.imgurl1 = this.attachmentType2[0].attachmentUrl;
          this.ruleForm.isProblem1 = this.attachmentType2[0].attachmentType;
        }
        this.attachmentType3 = res.rows.filter(
          (item) => item.attachmentType == 3
        );
        if (this.attachmentType3 != null && this.attachmentType3.length > 0) {
          this.ruleForm.imgurl2 = this.attachmentType3[0].attachmentUrl;
          this.ruleForm.isProblem2 = this.attachmentType3[0].attachmentType;
        }
        this.attachmentType4 = res.rows.filter(
          (item) => item.attachmentType == 4
        );
        if (this.attachmentType4 != null && this.attachmentType4.length > 0) {
          this.ruleForm.imgurl3 = this.attachmentType4[0].attachmentUrl;
          this.ruleForm.isProblem3 = this.attachmentType4[0].attachmentType;
        }
        this.attachmentType5 = res.rows.filter(
          (item) => item.attachmentType == 5
        );
        if (this.attachmentType5 != null && this.attachmentType5.length > 0) {
          this.ruleForm.imgurl4 = this.attachmentType5[0].attachmentUrl;
          this.ruleForm.isProblem4 = this.attachmentType5[0].attachmentType;
        }
        this.attachmentType6 = res.rows.filter(
          (item) => item.attachmentType == 6
        );
        if (this.attachmentType6 != null && this.attachmentType6.length > 0) {
          this.ruleForm.imgurl5 = this.attachmentType6[0].attachmentUrl;
          this.ruleForm.isProblem5 = this.attachmentType6[0].attachmentType;
        }
        this.attachmentType7 = res.rows.filter(
          (item) => item.attachmentType == 7
        );
        if (this.attachmentType7 != null && this.attachmentType7.length > 0) {
          this.ruleForm.imgurl6 = this.attachmentType7[0].attachmentUrl;
          this.ruleForm.isProblem6 = this.attachmentType7[0].attachmentType;
        }
        this.attachmentType8 = res.rows.filter(
          (item) => item.attachmentType == 8
        );
        if (this.attachmentType8 != null && this.attachmentType8.length > 0) {
          this.ruleForm.imgurl7 = this.attachmentType8[0].attachmentUrl;
          this.ruleForm.isProblem7 = this.attachmentType8[0].attachmentType;
        }
        this.attachmentType9 = res.rows.filter(
          (item) => item.attachmentType == 9
        );
        if (this.attachmentType9 != null && this.attachmentType9.length > 0) {
          this.ruleForm.imgurl8 = this.attachmentType9[0].attachmentUrl;
          this.ruleForm.isProblem8 = this.attachmentType9[0].attachmentType;
        }
        this.attachmentType10 = res.rows.filter(
          (item) => item.attachmentType == 10
        );
        if (this.attachmentType10 != null && this.attachmentType10.length > 0) {
          this.ruleForm.imgurl9 = this.attachmentType10[0].attachmentUrl;
          this.ruleForm.isProblem9 = this.attachmentType10[0].attachmentType;
        }
        this.attachmentType11 = res.rows.filter(
          (item) => item.attachmentType == 11
        );
        if (this.attachmentType11 != null && this.attachmentType11.length > 0) {
          this.ruleForm.imgurl10 = this.attachmentType11[0].attachmentUrl;
          this.ruleForm.isProblem10 = this.attachmentType11[0].attachmentType;
        }
        this.attachmentType12 = res.rows.filter(
          (item) => item.attachmentType == 12
        );
        if (this.attachmentType12 != null && this.attachmentType12.length > 0) {
          this.ruleForm.imgurl11 = this.attachmentType12[0].attachmentUrl;
          this.ruleForm.isProblem11 = this.attachmentType12[0].attachmentType;
        }
        this.attachmentType13 = res.rows.filter(
          (item) => item.attachmentType == 13
        );
        if (this.attachmentType13 != null && this.attachmentType13.length > 0) {
          this.ruleForm.imgurl12 = this.attachmentType13[0].attachmentUrl;
          this.ruleForm.isProblem13 = this.attachmentType13[0].attachmentType;
        }
        this.attachmentType14 = res.rows.filter(
          (item) => item.attachmentType == 14
        );
        if (this.attachmentType14 != null && this.attachmentType14.length > 0) {
          this.ruleForm.imgurl13 = this.attachmentType14[0].attachmentUrl;
          this.ruleForm.isProblem13 = this.attachmentType14[0].attachmentType;
        }
      });
    },
  },
};
</script>
<style scoped>
.zx_titel {
  padding: 15px;
  font-size: 20px;
  font-weight: bold;
  border-bottom: 1px solid #e0e2e6;
}
.upload_list {
  margin: 10px;
  border: 1px solid #e8e8ee;
}
.drawingsUploadLayout {
  padding: 20px;
  background-color: #fafafa;
  font-size: 16px;
  color: #222;
}
.upload_text {
  font-size: 8px;
  margin-bottom: 10px;
  color: rgb(192,192,192);
}
.img_list_text {
  font-size: 14px;
  color: #666;
}
.but_warp {
  padding: 20px;
  display: flex;
  justify-content: flex-end;
}
.fill_row {
  padding: 0 20px;
}
</style>